<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./lib/reset.css">
    <link rel="stylesheet" href="./css/03seek.css">

</head>

<body>
    <!-- 公共样式
    fl,左浮
    fr,右浮动
    bx,怪异盒子
    cb,清除浮动
    rel,相对定位
    abs，绝对定位  
    con ，版心 
  -->
    <div class="seek">
        <div class="img-box fl">
            <img src="./imge/images/login-bg.png" alt="">
        </div>
        <div class="form-box-right fl">
            <!-- 表单外面的盒子，不同页面使用次表单时，通过此盒子调整表单位置 -->
            <div class="form-box">
                <!-- 表单内容 -->
                <div class="form">
                    <img src="./imge/images/loginlogo.png" alt="">
                    <p class="form-seek">
                        <span class="form-seek-dl">账号登录</span>
                        <span class="form-seek-span1"></span>
                        <span class="form-seek-zc">扫码登陆</span>
                        <span class="form-seek-span2"></span>
                    </p>
                    <!-- 输入区域外层套给盒子，用来切换二维码和输入  -->
                    <div class="form-input-box">
                        <div class="form-seek-password">
                            <!-- span，模拟盒子，精灵图 -->
                            <span></span>
                            <input type="text" placeholder="用户名/手机号/邮箱">
                        </div>
                        <div class="form-seek-password">
                            <!-- span，模拟盒子，精灵图 -->
                            <span></span>
                            <input type="password" placeholder="密码:6位数字">
                        </div>
                        <!-- 忘记密码 -->
                        <div class="form-forget-password">
                            <span>忘记密码</span>
                        </div>
                        <button class="form-button">登录</button>
                    </div>
                    <!-- 二维码 -->
                    <div class="form-QR">
                        <img src="./imge/images/103-demo.png" alt="">
                        <p>微信扫码</p>
                        <p>未关注源码公众号，请先关注再注册登录</p>
                    </div>

                    <div class="form-registrant">还没源码账号？
                       <a href="./07register.html">
                        <span>立即注册</span>
                        <!-- 标签模拟盒子，精灵图 -->
                        <a></a>
                       </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>


</body>
<script src="./js/03seek.js"></script>

</html>